<template>
    <div class="content">
        <div id="cesiumContainerl"></div>
    </div>
</template>
<script>
export default {
    name: 'smallMap',
    data() {
        return {}
    },
    mounted() {
        var viewerl = new Cesium.Viewer('cesiumContainerl', {
            animation: false,
            baseLayerPicker: false,
            geocoder: false,
            homeButton: false,
            sceneModePicker: false,
            timeline: false,
            navigationHelpButton: false,
            fullscreenButton: false,
            infoBox: false,
            selectionIndicator: false,
            zoomIndicatorContainer: false,
            navigation: false,
        })
        // var labelImagery = new Cesium.UrlTemplateImageryProvider({
        //     url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
        //     minimumLevel: 3,
        //     maximumLevel: 18,
        // })
        // viewerl.imageryLayers.addImageryProvider(labelImagery)
        viewerl.imageryLayers.addImageryProvider(
            new Cesium.SingleTileImageryProvider({
                url: '/haiyuan/static/img/baise.png',
            })
        )
        viewerl._cesiumWidget._creditContainer.style.display = 'none'
        var scene = viewerl.scene
        viewerl.scene.open('http://10.10.12.251:8090/iserver/services/3D-XingZhengLouPingMianTu/rest/realspace')

        viewerl.camera.flyTo({
            destination: new Cesium.Cartesian3.fromDegrees(109.53146691813276, 18.310014020096276, 100),
            orientation: {
                heading: Cesium.Math.toRadians(0), // 方向
                pitch: Cesium.Math.toRadians(-90.0), // 倾斜角度
                roll: 0,
            },
            duration: 1,
        })

        var handler = new Cesium.ScreenSpaceEventHandler(scene.canvas)
        handler.setInputAction(function (e) {
            var position = scene.pickPosition(e.position)
            let selectlayer = viewer.scene.layers.getSelectedLayer()
            console.log(selectlayer)
            var cartographic = Cesium.Cartographic.fromCartesian(position)
            var longitude = Cesium.Math.toDegrees(cartographic.longitude)
            var latitude = Cesium.Math.toDegrees(cartographic.latitude)
            var height = cartographic.height
            if (height < 0) {
                height = 0
            }
            console.log(longitude + ',' + latitude + ',' + height)
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK)
        // viewerl.scene.camera.changed.addEventListener(function () {
        //     var position = viewer.camera.position
        //     var arr = []
        //     var cartographic = Cesium.Cartographic.fromCartesian(position)
        //     arr.push(Cesium.Math.toDegrees(cartographic.longitude))
        //     arr.push(Cesium.Math.toDegrees(cartographic.latitude))
        //     arr.push(viewer.camera.heading)
        //     console.log(arr);
        // })
        //    viewerl.entities.add({
        //         position: Cesium.Cartesian3.fromDegrees(109.53144912182765,18.310181093255693,1),
        //         billboard: {
        //           image:'/haiyuan/static/img/heise.png',
        //           // scale:0.5,
        //           width: 50,
        //           height: 74,

        //         },
        //     })
       viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                    109.531443132519 ,  18.3101808881625  ,
                   109.531461152078 ,  18.3101991230832 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/office.png',
            },
            id: 'office1',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                    109.531443269349 ,  18.3101685736828  ,
                   109.531461159123 ,  18.3101869316813 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/office.png',
            },
            id: 'office2',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                    109.531443471012 ,  18.3101564194386   ,
                   109.53146116631 ,  18.3101744939886 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/office.png',
            },
            id: 'office3',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                    109.531458438639 ,  18.3101808961345  ,
                    109.531475980396 ,  18.3101985874334 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/office.png',
            },
            id: 'office4',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                    109.531458263743 ,  18.3101684183943 ,
                    109.531475987394 ,  18.3101864750623 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/office.png',
            },
            id: 'office5',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                    109.531458398256 ,  18.3101564272133  ,
                    109.531475994265 ,  18.3101744837924 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/office.png',
            },
            id: 'office6',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                     109.531489199868 ,  18.3101803822697  ,
                    109.531506592015 ,  18.3101986061402 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/office.png',
            },
            id: 'office7',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                     109.531489071032 ,  18.310168151479 ,
                    109.531506592009 ,  18.3101863753495 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/office.png',
            },
            id: 'office8',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                   109.531489199858 ,  18.3101557983804 ,
                    109.531506592002 ,  18.3101741445588 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/office.png',
            },
            id: 'office9',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                      109.531428965074 ,  18.3101897991104    ,
                    109.531435385845 ,  18.3101983330675 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(90),
                material: '/haiyuan/static/img/archives.png',
            },
            id: 'archives1',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                       109.531428965073 ,  18.3101850444768 ,
                    109.531435385844 ,  18.3101935784339  
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(90),
                material: '/haiyuan/static/img/archives.png',
            },
            id: 'archives2',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                     109.531428965073 , 18.3101802898432 ,
                    109.531435514259 ,  18.3101888238004 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(90),
                material: '/haiyuan/static/img/archives.png',
            },
            id: 'archives3',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                   109.531428965073 ,  18.3101755352097 ,
                    109.531435385843 ,  18.3101840691667 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(90),
                material: '/haiyuan/static/img/archives.png',
            },
            id: 'archives4',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                    109.531428964916 ,  18.3101707805752 ,
                   109.531435385846 , 18.3101793145334 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(90),
                material: '/haiyuan/static/img/archives.png',
            },
            id: 'archives5',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                    109.531428708084 ,  18.310166025922 ,
                    109.531435385713 ,  18.3101746818283 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(90),
                material: '/haiyuan/static/img/archives.png',
            },
            id: 'archives6',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                        109.531429156577 ,  18.3101608818363   ,
                     109.531434878857 ,  18.3101694532062 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/cabinet.png',
            },
            id: 'cabinet1',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                    109.53149137964985,
                    18.310201372520133,
                    109.53150162249307,
                    18.310208213402063
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(0),
                material: '/haiyuan/static/img/archives.png',
            },
            id: 'cabinet2',
        })
        viewerl.entities.add({
            rectangle: {
                coordinates: Cesium.Rectangle.fromDegrees(
                    109.531441182672 ,  18.3101336113903  ,
                     109.531450538834 , 18.3101401498649 
                ),
                outline: true,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 4,
                stRotation: Cesium.Math.toRadians(-180),
                material: '/haiyuan/static/img/archives.png',
            },
            id: 'cabinet3',
        })
    },
}
</script>

<style lang="less" scoped>
@import '../../../assets/less/school.less';
.marker {
    border: none;
    border-radius: 50%;
}
.content {
    width: 100%;
    height: 100%;
    #cesiumContainerl {
        width: 100%;
        height: 100%;
    }
}
</style>